<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>形式审查</title>
@include('common-css')
<style>
.input_box {
    width: 100%;
    height: 40px;
    margin-top: 15px;
    margin-bottom: 15px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.input_label {
    width: 120px;
    box-sizing: border-box;
}

.application-list {
    margin-top: 20px;
}

.phase-tag {
    color: #1890ff;
    border: 1px solid #91d5ff;
    border-radius: 3px;
    background: #e6f7ff;
    font-size: 12px;
    padding: 2px 3px;
}

.ant-table-tbody > tr > td, .ant-table-thead > tr > th {
    vertical-align: middle;
    line-height: 25px;
}

.search_box {
    width: 1000px;
}

.search_box input {
    width: 300px;
}

.search_box button {
    margin-left: 20px;
}

.search_box .ant-select {
    margin-left: 20px;
}
</style>
</head>
<body>
<div id="app">

</div>
</body>
</html>

<script id="appTemplate" type="x-template">
<a-locale-provider :locale="antdLocale">
    <div class="container">

        @include('admin.header')

        <main>
            <div class="common_container">

                @include('admin.aside', ['selectedItem' => 'formal-review'])

                <div class="common_content admin_common_content">
                    <div v-if="false" class="search_box">
                        <a-input v-model="searchFields.keyword" placeholder="请输入关键字" @pressEnter="searchAward">
                        </a-input>
                        <a-select defaultValue="-1" @change="awardSearchType" style="width: 165px;">
                            <a-select-option value="-1">全部奖项类型</a-select-option>
                            <template v-for="award in awardsInfo">
                                <a-select-option :value="award.id">@{{award.name}}</a-select-option>
                            </template>
                        </a-select>
                        <a-select defaultValue="-1" @change="awardSearchStatus" style="width: 165px;">
                            <a-select-option value="-1">全部申报状态</a-select-option>
                            <template v-for="(statusItem, statusIndex) in statusInfo">
                                <a-select-option v-if="statusItem.phase == '形式审查'" :value="statusItem.status">
                                    @{{statusItem.status}}
                                </a-select-option>
                            </template>
                        </a-select>
                        <a-button type="primary" slot="enterButton" @click="searchAward" style="margin-left: 30px">
                            搜索
                        </a-button>
                        <a-button @click="resetSearch">重置</a-button>
                    </div>
                    <div class="common_box">
                        <div style="display: flex; position: relative;">
                            <span style="line-height: 30px;">共 @{{ filteredApplications.length }} 个项目</span>
                            <span style="flex: 1;"></span>
                            <a-input style="width: 300px;" placeholder="搜索" v-model="searchKeyword"/>
                            <a-icon v-if="searchKeyword"
                                    style="position: absolute; top: 8px; right: 8px; color: #aaa; cursor: pointer;"
                                    type="cross"
                                    @click="searchKeyword = ''"/>
                        </div>
                        <a-table class="application-list"
                                 rowKey="id"
                                 :columns="applicationListColumns"
                                 :dataSource="filteredApplications"
                                 :loading="applicationTableLoading"
                        >
                            <span slot="award_name" slot-scope="text, record">
                                @{{ findAwardInfoById(record.award_id).name }}
                            </span>
                            <span slot="project_name" slot-scope="text, record">
                                @{{ record.project_name ? record.project_name : '-' }}
                            </span>
                            <span slot="applicant" slot-scope="text, record">
                                @{{ record.applicant_name }}
                                <a-popover :title="record.applicant_name + '的联系方式'">
                                    <template slot="content">
                                        <table>
                                            <tr>
                                                <td width="30"><a-icon type="phone"/></td>
                                                <td>@{{ record.applicant_tel }}</td>
                                            </tr>
                                            <tr>
                                                <td><a-icon type="mail"/></td>
                                                <td>@{{ record.applicant_email }}</td>
                                            </tr>
                                        </table>
                                    </template>
                                    <a style="font-size: 12px;" href="">联系方式</a>
                                </a-popover>
                                <br/>
                                @{{ record.applicant_org_name }}
                            </span>
                            <span slot="nominators" slot-scope="text, record">
                                <template v-if="findAwardInfoById(record.award_id).nomination_required">
                                    <p v-for="nominatorId in record.nominator_ids">@{{ getNominatorById(nominatorId).name }}</p>
                                </template>
                                <template v-else>-</template>
                            </span>
                            <span slot="application_form" slot-scope="text, record">
                                <a :href="'/home/fill-form?id=' + record.id" target="_blank">
                                    <span>查看</span>
                                </a>
                            </span>
                            <span slot="status" slot-scope="text, record">
                                <span class="phase-tag">@{{ record.status_info.phase }}阶段</span>
                                <div>@{{ record.status_info.status }}</div>
                            </span>
                            <span slot="todo" slot-scope="text, record">
                                <span class="orange">@{{ record.status_info.admin_todo }}</span>
                            </span>
                            <span slot="operations" slot-scope="text, record">
                                <template v-if="record.status_id == 'B2'">
                                    <a-popconfirm title="确认通过形式审查？"
                                                  @confirm="applicationThroughFormalReview(record)" okText="是"
                                                  cancelText="否">
                                        <a-button type="primary" size="small" :disabled="changingApplicationStatus"
                                        >通过形式审查</a-button>
                                    </a-popconfirm>
                                    <a-popconfirm title="确认退回该申报书？"
                                                  @confirm="showFillRecallReasonModal(record)" okText="是"
                                                  cancelText="否"
                                                  style="margin-left: 12px;">
                                        <a-button size="small"
                                        >退回修改</a-button>
                                    </a-popconfirm>
                                </template>
                                <template v-if="record.status_id === 'C2'">
                                    <a-popconfirm title="确认提交专家初评？"
                                                  @confirm="applicationSubmitExpertReview(record)" okText="是"
                                                  cancelText="否">
                                            <a-button type="primary" size="small"
                                            >提交专家初评</a-button>
                                    </a-popconfirm>
                                    <a-button style="margin-left: 10px;"
                                              v-show="record.pdf_file_save_path"
                                              size="small"
                                              @click="downloadAwardDoc(record.pdf_file_save_path)">
                                        下载打印版申报书</a-button>
                                </template>
                            </span>
                        </a-table>
                    </div>
                </div>
            </div>
        </main>
        <a-modal
                title="退回原因"
                :visible="showRecallReasonModal"
                @ok="confirmReasonModal"
                @cancel="cancelReasonModal"
        >
            <a-textarea v-model="recallReason" placeholder="请填写退回原因" :rows="4"></a-textarea>
        </a-modal>
    </div>
</a-locale-provider>
</script>

@include('common-js')

<script>
const applicationListColumns = [
    {
        width: 60,
        title: '序号',
        dataIndex: 'num'
    }, {
        width: 90,
        title: '奖项类型',
        dataIndex: 'award_name',
        scopedSlots: {
            customRender: 'award_name'
        }
    }, {
        width: 150,
        title: '项目名称',
        dataIndex: 'project_name',
        scopedSlots: {
            customRender: 'project_name'
        }
    }, {
        width: 180,
        title: '申报者',
        dataIndex: 'applicant',
        scopedSlots: {
            customRender: 'applicant'
        }
    }, {
        width: 70,
        title: '申报书',
        dataIndex: 'application_form',
        scopedSlots: {
            customRender: 'application_form'
        }
    }, {
        width: 120,
        title: '申报状态',
        dataIndex: 'status',
        scopedSlots: {
            customRender: 'status'
        }
    }, {
        width: 100,
        title: '待办事项',
        dataIndex: 'applicant_todo',
        scopedSlots: {
            customRender: 'todo'
        }
    }, {
        width: 250,
        title: '操作',
        key: 'operations',
        scopedSlots: {
            customRender: 'operations'
        }
    }
];

var awardsInfo = {!! json_encode(array_values(config('vars.awards')), JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
var statusInfo = {!! json_encode(array_values(config('vars.status_defs')), JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
var nominators = {!! json_encode($nominators, JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
var applications = {!! json_encode($applications, JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT) !!};
var viewStatusId = "{!! $viewStatusId !!}";
var awardId = "{!! isset($awardId) ? $awardId : null !!}";
var defaultSelectedKeys = ['3-1-1'];
if (viewStatusId === 'B2') {
    defaultSelectedKeys = awardId == 1 ? ['3-1-1'] : ['3-1-2']
} else if (['C1', 'C2'].indexOf(viewStatusId) !== -1) {
    defaultSelectedKeys = ['3-1-3']
}

function processApplicationsData(applications) {
    var n = 1;
    applications.forEach(item => {
        item.num = n;
        n += 1
    })
}

processApplicationsData(applications);

Vue.prototype.$axios = axios;
var app = new Vue({
    el: '#app',
    template: '#appTemplate',
    data: {
        searchKeyword: '',
        viewStatusId: viewStatusId,
        defaultSelectedKeys: defaultSelectedKeys,
        showRecallReasonModal: false,
        recallReason: '',
        recallApplication: null,
        searchFields: {
            keyword: '',
            awardType: -1,
            awardStatus: -1
        },
        applicationTableLoading: false,
        chooseAwardToApplyDialogVisible: false,
        chooseNominatorsDialogVisible: false,
        newApplicationAwardId: awardsInfo[0].id,
        newApplicationNominatorId1: 0,
        newApplicationNominatorId2: 0,
        newApplicationNominatorId3: 0,
        newApplicationNominatorId4: 0,
        newApplicationNominatorId5: 0,
        applications: applications,
        nominators: nominators,
        changingApplicationStatus: false,
        deletingApplicationForm: false,
        awardsInfo: awardsInfo,
        statusInfo: statusInfo,
        applicationListColumns: applicationListColumns,
        changePasswordDialogVisible: false,
        passwordInfo: {
            password: '',
            passwordConfirm: ''
        },
        antdLocale: antd.locales.zh_CN
    },
    computed: {
        filteredApplications() {
            if (this.searchKeyword) {
                var q = this.searchKeyword.trim();
                return this.applications.filter(item => {
                    var text = (item.award_id == 1 ? '科学技术进步奖' : '科技人物奖') + item.project_name + item.applicant_name + item.applicant_org_name + item.applicant_tel + item.applicant_email;
                    return text.toLowerCase().indexOf(q) != -1
                })
            } else {
                return this.applications
            }
        },
        newApplicationAwardInfo() {
            return this.findAwardInfoById(this.newApplicationAwardId)
        },
        nominatorGroupNames() {
            var result = [];
            this.nominators.forEach(item => {
                if (!result.includes(item.group_name)) {
                    result.push(item.group_name)
                }
            });
            return result
        }
    },
    mounted() {
    },
    beforeMount() {
        this.loadAsideDefaultOpenKeys()
    },
    methods: {
        applicationThroughFormalReview(application) {
            this.changeApplicationStatus(application, '/api/award/through-formal-review')
        },
        applicationSubmitExpertReview(application) {
            this.changeApplicationStatus(application, '/api/award/submit-expert-review')
        },
        showFillRecallReasonModal(application) {
            this.showRecallReasonModal = true;
            this.recallApplication = application
        },
        confirmReasonModal() {
            if (this.recallReason === '') {
                antd.message.warn('退回原因不能为空');
                return false
            } else {
                this.changeApplicationStatus(this.recallApplication, '/api/award/recall-application');
                this.showRecallReasonModal = false
            }
        },
        changeApplicationStatus(application, url) {
            let postData = {
                application_id: application.id
            };
            if (url === '/api/award/recall-application') {
                this.showRecallReasonModal = true;
                postData.recall_reason = this.recallReason
            }
            this.changingApplicationStatus = true;
            antd.message.loading('正在处理，请稍候', 0);
            axios.post(url, postData).then(res => {
                antd.message.destroy();
                var data = res.data;
                if (data.ok) {
                    antd.message.success('操作成功');
                    this.recallReason = '';
                    this.recallApplication = null;
                    // this.reloadData()
                    history.go(0)
                } else {
                    antd.message.warn(data.message, 3)
                }
                this.changingApplicationStatus = false
            })
        },
        cancelReasonModal() {
            this.showRecallReasonModal = false
        },
        awardSearchType(type) {
            console.log('type', type);
            this.searchFields.awardType = type
        },
        awardSearchStatus(status) {
            this.searchFields.awardStatus = status
        },
        searchAward() {
            this.reloadData()
        },
        resetSearch() {
            this.searchFields.keyword = '';
            this.searchFields.awardType = -1;
            this.searchFields.awardStatus = -1;
            this.reloadData('is_reset')
        },
        downloadAwardDoc(path) {
            window.open(path)
        },
        printAward(id) {
            window.open('/apply/show-print?award_id=' + id)
        },
        getNominatorById(id) {
            return this.nominators.filter(item => {
                return item.id == id
            })[0]
        },
        getNominatorsByGroup(nominatorGroup) {
            return this.nominators.filter(item => {
                return item.group_name == nominatorGroup
            })
        },
        changeApplicationStatusOld(application, statusId) {
            let data = {
                application_id: application.id,
                status_id: statusId
            };
            if (statusId === 'B1.2') {
                this.showRecallReasonModal = true;
                data.recall_reason = this.recallReason
            }
            this.changingApplicationStatus = true;
            antd.message.loading('正在处理，请稍候', 0);

            axios.post('/api/award/change-application-status', data).then(res => {
                antd.message.destroy();
                console.log(res);
                var data = res.data;
                if (data.ok) {
                    antd.message.success('操作成功');
                    this.recallReason = '';
                    this.recallApplication = null;
                    this.reloadData()
                } else {
                    antd.message.warn(data.message, 3)
                }
                this.changingApplicationStatus = false
            })
        },
        handleDeleteApplication(application) {
            console.log('application', application);
            this.deletingApplicationForm = true;
            antd.message.loading('正在处理，请稍候', 0);
            axios.post('/api/award/delete-application', {
                application_id: application.id
            }).then(res => {
                antd.message.destroy();
                console.log(res);
                var data = res.data;
                if (data.ok) {
                    antd.message.success('删除成功');
                    this.reloadData()
                } else {
                    antd.message.warn(data.message, 3)
                }
                this.deletingApplicationForm = false
            })
        },
        showChooseNominatorsDialog() {
            this.chooseNominatorsDialogVisible = true
        },
        handleChooseNominatorsOk() {
            console.log('newApplicationAwardId', this.newApplicationAwardId);
            var nominatorIds = [this.newApplicationNominatorId1, this.newApplicationNominatorId2, this.newApplicationNominatorId3, this.newApplicationNominatorId4, this.newApplicationNominatorId5];
            nominatorIds = nominatorIds.filter(item => item != 0);
            var awardId = this.newApplicationAwardId;
            var awardInfo = this.newApplicationAwardInfo;
            console.log('nominatorIds', nominatorIds);
            if (nominatorIds.length == 0) {
                antd.message.warn('{{ config('vars.strings.no_nominator_selected') }}');
                return
            }
            this.submitNewApplication(awardId, nominatorIds);
            this.chooseNominatorsDialogVisible = false
        },
        handleChooseAwardToApplyOk() {
            console.log('newApplicationAwardId', this.newApplicationAwardId);
            this.chooseAwardToApplyDialogVisible = false;
            var awardId = this.newApplicationAwardId;
            var awardInfo = this.newApplicationAwardInfo;
            if (awardInfo.nomination_required) {
                this.showChooseNominatorsDialog()
            } else {
                this.submitNewApplication(awardId, [])
            }
        },
        showChooseAwardToApplyDialog() {
            this.chooseAwardToApplyDialogVisible = true
        },
        findAwardInfoById(id) {
            return this.awardsInfo.filter(item => {
                return item.id == id
            })[0]
        },
        reloadData(type = 'all') {
            let data = {
                status_id: this.viewStatusId,
                searchFields: JSON.stringify(this.searchFields)
            };
            if (type == "is_reset") {
                data = {
                    status_id: this.viewStatusId
                }
            }
            this.applicationTableLoading = true;
            axios.post('/api/award/get-application-by-status', data).then(res => {
                this.applicationTableLoading = false;
                antd.message.destroy();
                var applications = res.data;
                console.log(applications);
                processApplicationsData(applications);
                this.applications = applications
            })
        },
        handleHeaderDropdownItemClick: handleHeaderDropdownItemClick,
        handleChangePasswordOk: handleChangePassword
    }
})
</script>